import 'package:flutter/material.dart';
import './model/post.dart';
class ViewDemo extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return GridViewBuilderDemo();
  }
}

//按需生成数量的 网格试图 GridViewBuilder
class GridViewBuilderDemo extends StatelessWidget {

  Widget _gridviewBuilder(BuildContext context,int index){
    return Container(
      child: Image.network(
        posts[index].imageUrl,
        fit: BoxFit.cover,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return GridView.builder(
      itemCount: posts.length,
      itemBuilder: _gridviewBuilder,
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 3,
        crossAxisSpacing: 8.0,
        mainAxisSpacing: 8.0,
      ),
    );
  }
}


//GridView count 网格试图
class GridViewCountDemo extends StatelessWidget {

  List<Widget> _buildertitles(int length){
    return List.generate(length,(int index){
      return Container(
        color: Colors.grey[300],
        alignment: Alignment(0.0, 0.0),
        child: Text('Item $index,',style: TextStyle(fontSize: 18.0,color: Colors.white),),
      );
    });
  }

  @override
  Widget build(BuildContext context) {
    return GridView.count(
      crossAxisCount: 3,
      crossAxisSpacing: 16.0,
      mainAxisSpacing: 16.0,
      scrollDirection: Axis.horizontal,
      children: _buildertitles(100),
    );
  }
}


//PageView builder 的使用 

class PageViewBuilderDemo extends StatelessWidget {
  Widget _pageItemBuilder(BuildContext context,int index){
    return Stack(
      children: <Widget>[
        SizedBox.expand( //沾满所有可用空间
          child: Image.network(posts[index].imageUrl,fit: BoxFit.cover,),
        ),
        Positioned(
          bottom: 8.0,
          left: 8.0,
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              Text(
                posts[index].title,
                style: TextStyle(fontWeight: FontWeight.bold),
              ),
              Text(
                posts[index].author,
                style: TextStyle(fontWeight: FontWeight.bold),
              )
            ],
          ),
        )
      ],
    );
  }
  @override
  Widget build(BuildContext context) {
    return PageView.builder(
      itemCount: posts.length,
      itemBuilder: _pageItemBuilder,
    );
  }
}



//PageView 的用法
class PageViewDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return PageView(


      pageSnapping: true,  //默认yes ，滚动到 一半会翻页
      scrollDirection: Axis.horizontal,  //滚动的方向
      onPageChanged: (currentPage) => debugPrint('page:$currentPage'),  //获取到 翻到那一页了
      controller: PageController(
        initialPage: 1, //设置默认显示那一也\
        keepPage: false,
        viewportFraction: 1.0, //页面占用比例
      ),

      children: <Widget>[
        Container(
          color: Colors.brown[100],
          alignment: Alignment(0.0,0.0),
          child: Text(
            '123',
            style: TextStyle(
              fontSize: 32.0,
              color: Colors.white,
            ),
          ),
        ),
        Container(
          color: Colors.yellow[100],
          alignment: Alignment(0.0,0.0),
          child: Text(
            '123',
            style: TextStyle(
              fontSize: 32.0,
              color: Colors.white,
            ),
          ),
        ),
        Container(
          color: Colors.red[100],
          alignment: Alignment(0.0,0.0),
          child: Text(
            '123',
            style: TextStyle(
              fontSize: 32.0,
              color: Colors.white,
            ),
          ),
        )
      ],
    );
  }
}
